<?php

$redis = new Redis();
$redis->connect('127.0.0.1', 6379);

// 换行符，如果是通过http访问本页面，则换行为<br/>, 如果是通过命令行执行此脚本，换行符为\n
$seperator = PHP_SAPI == "cli" ? "\n" : "<br/>";

// 最近30天的数组
for($i = time()-30*24*3600; $i <= time(); $i += 24*3600) {
    $dates[] = date('Y-m-d', $i);
}

$dau_array = $wau_array = $mau_array = array();

foreach ($dates as $date) {
    //echo $date . " > ".$seperator;

    $active_by_day = $redis->bitCount('login:'.$date);
    //echo "日活跃用户数量: " . $active_by_day . $seperator;
    $dau_array[$date] = $active_by_day;

    $redis->del('login:week'); //初始化key
    $active_dates = array(); //初始化dates
    $active_dates[] = 'OR';
    $active_dates[] = 'login:week';
    for($i = 0; $i < 7; $i++) {
        $timestamp = $i*24*3600;
        $active_dates[] = 'login:'.date('Y-m-d', strtotime($date.' 23:00:00')-$timestamp);
    }
    call_user_func_array(array($redis, 'bitOp'), $active_dates);
    $active_by_week = $redis->bitCount('login:week');
    //echo "周活跃用户数量: " . $active_by_week . $seperator;
    $wau_array[$date] = $active_by_week;

    $redis->del('login:month'); //初始化key
    $active_dates = array(); //初始化dates
    $active_dates[] = 'OR';
    $active_dates[] = 'login:month';
    for($i = 0; $i < 30; $i++) {
        $timestamp = $i*24*3600;
        $active_dates[] = 'login:'.date('Y-m-d', strtotime($date.' 23:00:00')-$timestamp);
    }
    call_user_func_array(array($redis, 'bitOp'), $active_dates);
    $active_by_month = $redis->bitCount('login:month');
    //echo "月活跃用户数量: " . $active_by_month . $seperator;
    $mau_array[$date] = $active_by_month;

    //echo $seperator;
}

$redis->close();
?>
<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>活跃度统计</title>
</head>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="dau" style="height:400px"></div>
<div id="wau" style="height:400px"></div>
<div id="mau" style="height:400px"></div>
<!-- ECharts单文件引入 -->
<script src="http://echarts.baidu.com/build/dist/echarts-all.js"></script>
<script type="text/javascript">
    // 用户日活跃度
    displayCharts('dau', '#ff7f50', '用户日活跃度', '日活跃度DAU', ['<?=implode("','", $dates)?>'], [<?=implode(',', $dau_array)?>]);
    // 用户周活跃度
    displayCharts('wau', '#87cefa', '用户周活跃度', '周活跃度WAU', ['<?=implode("','", $dates)?>'], [<?=implode(',', $wau_array)?>]);
    // 用户月活跃度
    displayCharts('mau', '#da70d6', '用户月活跃度', '月活跃度MAU', ['<?=implode("','", $dates)?>'], [<?=implode(',', $mau_array)?>]);
    // 活跃度图
    function displayCharts(id, color, title, legend, x_data, y_data) {
        // 基于准备好的dom，初始化echarts图表
        var myChart = echarts.init(document.getElementById(id), 'macarons');

        var option = {
            color:[color],
            title : {
                text: title
            },
            tooltip : {
                trigger: 'axis'
            },
            xAxis : [
                {
                    type : 'category',
                    boundaryGap : false,
                    data : x_data
                }
            ],
            yAxis : [
                {
                    type : 'value'
                }
            ],
            series : [
                {
                    name:legend,
                    type:'line',
                    smooth:true,
                    itemStyle: {normal: {areaStyle: {type: 'default'}}},
                    data:y_data
                }
            ]
        };
        // 为echarts对象加载数据
        myChart.setOption(option);
    }
</script>
</body>
